<template>
  <div class="son4">
    <button @click="syncChangeCount">通过actions异步将count从10改成1000</button>
    <button @click="syncChangeTitle">通过辅助函数actions实现异步修改标题</button>
    筛选出大于5的值
    <span>{{ $store.getters.filterTen }}</span>
    通过辅助函数mapGetters 筛选出大于5的值 <span>{{ filterTen }}</span>
  </div>
</template>

<script>
// 导入actions辅助函数 mapGetter和mapState 都是映射属性
import { mapActions, mapGetters } from 'vuex'

export default {
  computed: {
    ...mapGetters(['filterTen'])
  },
  methods: {
    // 使用辅助函数，相当于调用了 dispatch  mapActions和mapMutations 都是映射方法
    ...mapActions(['syncChangeTitles']),
    syncChangeCount () {
      this.$store.dispatch('syncChangeCount', 1000)
    },
    syncChangeTitle () {
      this.syncChangeTitles('测试标题')
    },
    fuzhu () {
      console.log(this.filterTen())
    }
  }
}
</script>

<style>

</style>
